<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>秒杀详情页</title>
    <%@include file="common/head.jsp"%>
</head>
<body>
     <div class="container">
         <div class="panel panel-default text-center">
             <div class="panel-heading">
                 <h1>${seckill.name}</h1>
                 <h2 class="text-danger">
                     <%-- 显示time图标--%>
                     <span class="glyphicon glyphicon-time"></span>
                     <%-- 展示倒计时 --%>
                     <span class="glyphicon" id="seckill-box"></span>
                 </h2>
             </div>
         </div>
         <div class="panel-body">
         </div>
     </div>

     <!-- 模态框（Modal） -->
     <div class="modal fade" id="killPhoneModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
         <div class="modal-dialog">
             <div class="modal-content">
                 <div class="modal-header">
                     <h3 class="modal-title text-center" id="myModalLabel">
                         <span class="glyphicon glyphicon-phone"></span>秒杀电话
                     </h3>
                 </div>
                 <div class="modal-body">
                     <div class="row">
                         <div class="col-xs-8 col-xs-offset-2">
                             <input type="text" name="killPhone" id="killPhoneKey"
                                placeholder="填手机号^。^" class="form-control">
                         </div>
                     </div>
                 </div>
                 <div class="modal-footer">
                     <span id="killPhoneMessage" class="glyphicon"></span>
                     <button type="button" class="btn btn-success" id="killPhoneBtn">
                         <span class="glyphicon glyphicon-phone"></span>
                         Submit
                     </button>
                 </div>
             </div><!-- /.modal-content -->
         </div><!-- /.modal -->
     </div>
</body>
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="http://cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-countdown/2.0.1/jquery.plugin.min.js"></script>
<script src="http://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-countdown/2.0.1/jquery.countdown.min.js"></script>
<script type="text/javascript" src="/resources/script/seckill.js"></script>
<script type="text/javascript">
    $(function () {
        seckill.detail.init({
            seckillId: ${seckill.seckillId},
            startTime: ${seckill.startTime.time}, // 毫秒
            endTime: ${seckill.endTime.time}
        })
    })
</script>
</html>